 $(document).ready(function() {
        //Default Action
        $(&quot;.tab_content&quot;).hide();
        //Hide all content
        $(&quot;.subtab_content&quot;).hide();
        //Hide all content
        $(&quot;ul.tabs li:first&quot;).addClass(&quot;active&quot;).show();
        //Activate first tab
        $(&quot;ul.subtabs li:first&quot;).addClass(&quot;active&quot;).show();
        //Activate first tab
        $(&quot;.tab_content:first&quot;).show();
        //Show first tab content
        $(&quot;.subtab_content:first&quot;).show();
        $(&quot;ul.tabs li&quot;).click(function() {
          $(&quot;ul.tabs li&quot;).removeClass(&quot;active&quot;);
          //Remove any &quot;active&quot; class
          $(this).addClass(&quot;active&quot;);
          //Add &quot;active&quot; class to selected tab
          $(&quot;.tab_content&quot;).hide();
          //Hide all tab content
          var activeTab = $(this).find(&quot;a&quot;).attr(&quot;href&quot;);
          //Find the rel attribute value to identify the active tab + content
          $(activeTab).fadeIn();
          //Fade in the active content
          return false;
        }
                                       );
        $(&quot;ul.subtabs li&quot;).click(function() {
          $(&quot;ul.subtabs li&quot;).removeClass(&quot;active&quot;);
          //Remove any &quot;active&quot; class
          $(this).addClass(&quot;active&quot;);
          //Add &quot;active&quot; class to selected tab
          $(&quot;.subtab_content&quot;).hide();
          //Hide all tab content
          var activeTab = $(this).find(&quot;a&quot;).attr(&quot;href&quot;);
          //Find the rel attribute value to identify the active tab + content
          $(activeTab).fadeIn();
          //Fade in the active content
          return false;
        }
                                          );
      }
                       );